.db-time {
  .container {
    .left-side {
      float: left;
      margin-right: 20px;
      width: 100px;
    }
    .main {
      overflow: hidden;
      .u-list {
        .u-item {
          display: inline-block;
          margin: 0 60px 30px 0;
          width: 100px;
          vertical-align: top;
          text-align: center;
          .u-link {
            position: relative;
            display: block;
            &::before {
              content: "";
              position: absolute;
              left: 0;
              top: 0;
              width: 100%;
              height: 100%;
              background-image: linear-gradient(to bottom, transparent 0%, transparent 50%, rgba(0,0,0,0.2) 100%);
            }
            img {
              display: block;
              width: 100px;
              height: 141px;
            }
            &::after {
              content: "";
              position: absolute;
              right: 5px;
              bottom: 5px;
              width: 12px;
              height: 12px;
              background-size: 12px;
              background-repeat: no-repeat;
            }
            &.sound::after {
            background-image: url(./../../assets/img/DbTime/sound.png);
            }
            &.video::after {
            background-image: url(./../../assets/img/DbTime/video.png);
            }
          }
          .desc {
            margin-top: 10px;
            .title {
              color: #333;
              &:hover {
                color: #fff;
              }
            }
            .type {
              color: #999;
            }
          }
        }
      }
    }
  }
}